<script type="text/javascript">
<!--
	$(document).ready(function(){
		ponerTitulo("Administracion de Roles ");
			jQuery("#s4list").jqGrid({ 
			url:'${pageContext.request.contextPath}/rol.action?oper=cargarRoles',
			editurl:'${pageContext.request.contextPath}/rol.action', 
			datatype: "json", 
			height: 'auto', width: 'auto', 
			colModel:[ 
						{name:'idRol',index:'IdRol', hidden:true,width:150, label:'ID Rol', sortable:true, editable:false},
						{name:'nombreRol',index:'nombreRol', width:250, label:'Nombre Rol', editable:true, edittype:"text",editoptions: {maxlength: 20}},
						{name:'descripcionRol',index:'descripcionRol', width:150, label:'Descripcion', editable:true, edittype:"text",editoptions: {maxlength: 50}}								
					], 
			rowNum:20, rowList:[2,20,30], 
			mtype: "POST", 
			rownumbers: true, rownumWidth: 40, 
			gridview: true, 
			pager: '#s4pager', 
			sortname: 'idRol', viewrecords: true, sortorder: "asc", 
			caption: "Administracion de Roles" 
		}).navGrid('#s4pager', { edit:true,add:true,del:true,search:false,refresh:true }, 
				{	width:600,height:320,
			beforeShowForm:function(formid){
				$("#idRol").attr("readonly","readonly");
			//	cargarCombo('${pageContext.request.contextPath}/combo.action','gerenciaCombo','#gerencia');
			}
		}, // edit options 
		
		
		{	width:600,height:320,
			beforeShowForm:function(formid){
				
				//cargarCombo('${pageContext.request.contextPath}/combo.action','gerenciaCombo','#gerencia');
			},
			afterShowForm:function(){
				
			}
		}, // add options 
		
		{width:375,height:175}, //del options 
		{multipleSearch:true} // search options 
	);
			
				
	});
</script>
<!-- <input type="text" id="prueba"/> -->
<center>
<table id="s4list" cellpadding="0" cellspacing="0" ></table> 
<div id="s4pager"  style="text-align:center;"></div>
</center>